<template>
	<div class="inConbox clearfix det_bg">
		<!-- 头部 -->
		<Nav :URL="urls.url" :text="urls.text"></Nav>
		<!-- 分享 -->
		<!--<div class="user_share_content">
        <section class="share_link">
            <input type="text" class="share_inputlink" id="manageLink" disabled="disabled" v-model="shareModel">
            <button class="copy_link"  @click="copyUrl">复制链接</button>
         </section>
    <div class="share_poster">
      <img src="../../../static/images/index/banner1.jpg" alt="">
      <button>点击保存 </button>  
    </div>
    </div>-->
		<div class="user_share_main share_bg">
			<input type="text" class="share_inputlink" id="manageLink" v-model="shareModel" >
			<img class="saveimg_btn" src="../../../static/images/fee/clicksave.png" alt="" />
			<div class="copy_link dipW ju_al">
				<div class="link_address">
					http://www.baidu.com/#
				</div>
				<div class="link_btn" @click="copyUrl">
					复制链接
				</div>
			</div>
		</div>
	</div>
</template>
<script>
	import Nav from '../mallConent/mallTopNav'
	export default {
		data() {
			return {
				urls: {
					url: '/bomNav/userContent',
					text: '邀请',
				},
				shareModel: 'www.baidu.com',
				textareaS: '', // 意见反馈
				ifisOpinion: false, // 反馈成功
			}
		},
		methods: {
			btnPostOpiniion() {
				if(this.textareaS != "") {
					this.$store.dispatch('showloader')
					this.axios.post(this.$busPoat.user(), {
						"content": this.textareaS
					}).then(response => {
						var st;
						clearTimeout(st)
						st = setTimeout(() => {
							if(response != null || response != undefined) {
								this.$store.dispatch('hideloader')
								if(response.data.iplancode == 200) {
									this.ifisOpinion = true;
									this.textareaS = ''
								} else if(response.data.iplancode == 101) {
									alert('亲，你的反馈次数已用完，如果您还有什么意见，请24小时后在反应')
									this.$router.replace({
										path: '/bomNav/userContent'
									})
								}
							} else {
								this.$store.dispatch('hideloader')
								alert('请求加载过慢...')
							}
							clearTimeout(st)
						}, 2000)
					}).catch(error => {
						this.$store.dispatch('hideloader')
						alert('反馈发送失败')
					})
				} else {
					alert('请输入反馈的内容')
				}
			},
			getreturnblok() {
				this.$router.replace({
					path: '/bomNav/userContent'
				})
			},
			//复制链接
			copyUrl() {
				let Url2 = document.getElementById("manageLink");
				Url2.select(); // 选择对象
				document.execCommand("Copy"); // 执行浏览器复制命令
				// this.linksCopy = '已复制';
				// this.copyBtnColor = true;
			}
		},
		components: {
			Nav
		} //引入组件
	}
</script>
<style lang="scss" scoped>
	.det_bg {
		margin: 0rem;
		z-index: 51;
		height: 100%;
		background: #f2f2f2;
		position: fixed;
	}
	
	.user_share_content {
		padding: 0rem .4rem;
		background: transparent;
		width: 100%;
		position: relative;
		margin-top: 1rem;
		.share_link {
			width: 100%;
			height: 2rem;
			border: .02rem solid orange;
			.share_inputlink {
				display: block;
				border: .02rem solid palevioletred;
				color: #DEDEDE;
				width: 80%;
				height: .8rem;
				line-height: .8rem;
				padding-left: .2rem;
				padding-right: .2rem;
				margin: .2rem auto;
				text-align: center;
			}
			.copy_link {
				display: block;
				border: 1px solid red;
				width: 1.8rem;
				height: .6rem;
				margin: .25rem auto;
				background: #FF7200;
				color: #ffe5e5;
				font-size: .2rem;
				text-align: center;
				line-height: .6rem;
			}
		}
		.share_poster {
			width: 100%;
			height: 8rem;
			border: .02rem solid orange;
			margin-top: .2rem;
			img {
				width: 80%;
				height: 6rem;
				display: block;
				margin: .2rem auto;
			}
			button {
				display: block;
				border: 1px solid red;
				width: 1.8rem;
				height: .6rem;
				margin: .25rem auto;
				background: #FF7200;
				color: #ffe5e5;
				font-size: .2rem;
				text-align: center;
				line-height: .6rem;
			}
		}
	}
	
	.user_share_main {
		width: 100%;
		height: 100%;
		position: relative;
		margin-top: .8rem;
		position: relative;
		.saveimg_btn{
			position: absolute;
			top: 70%;
			left: 50%;
			transform: translate(-50%,-50%);
		
		}
		.copy_link{
			width: 70%;
			height: .7rem;
			position: absolute;
			top: 80%;
			left: 50%;
			transform: translate(-50%,-50%);
			border: .01rem solid #000000;
			border-radius: .6rem;
			.link_address{
				width: 70%;
				height: .7rem;
				line-height: .7rem;
				color: #FFFFFF;
				font-family: "微软雅黑";
				font-size: .28rem;
				border-right: .01rem solid #000000;
			}
			.link_btn{
				color: #FFFFFF;
				font-family: "微软雅黑";
				font-size: .28rem;
				padding-left: .1rem;
			}
		}
	}
	#manageLink{
			display: none;
	}
	.share_bg {
		background-image: url("../../../static/images/fee/sharepage.png");
		background-repeat: no-repeat;
	}
</style>